@extends('huweize.layouts.userHome')
@section('title','积分兑换-阅文作家专区')
@section('main')
    <div class="col-md-12 Integral">
        <h3>积分兑换</h3>
    </div>
    <div class="bs-example bs-example-tabs" data-example-id="togglable-tabs">
        <ul id="myTabs" class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active"><a href="#home" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">积分商城</a></li>
            <li role="presentation" class=""><a href="#profile" role="tab" id="profile-tab" data-toggle="tab" aria-controls="profile" aria-expanded="false">获取积分记录</a></li>
            <li><a href="#dropdown1" role="tab" id="dropdown1-tab" data-toggle="tab" aria-controls="dropdown1">消耗积分记录</a></li>
        </ul>
        <div id="myTabContent" class="tab-content">
            <div role="tabpanel" class="tab-pane fade active in" id="home" aria-labelledby="home-tab">
                <div class="col-md-12 Integral_first">
                    <a href="" class="Integral_green" target="_blank">积分构成和来源说明</a>
                    <span>当前积分:<em class="blueNum">0</em></span>
                </div>
                <div class="col-md-12">
                    <ul class="award">
                        <li>
                            <span class="award_cash">
                                <button class="btn btn-info award_cash_first" data-toggle="modal" data-target="#award_button">兑换</button>
                            </span>
                            <div class="award_cash_img"></div>
                            <div class="award_cash_text">
                               <h3>勤奋写作豁免权</h3>
                               <h4>为鼓励大家都在稳定的更新中前进，不可求高字数，更有独家豁免权防止意外，没有打折！</h4>
                               <h5>
                                   <span class="glyphicon glyphicon-list-alt"></span>
                                   兑换细则
                               </h5>
                                <p>
                                    1.作者每周期兑换豁免权，可由等级积分直接兑换，<a class='award_cash_blue' target="_blank">查看详情</a>
                                </p>
                                <p>
                                2.在不满足勤奋写作奖条件的月份，可以进行豁免权兑换，每一次兑换，可豁免1000字
                                </p>
                                <p>
                                    3.每次消耗1000积分
                                </p>
                            </div>
                        </li>
                    </ul>
                </div>

                {{--兑换模态框--}}
                <div class="modal fade" id="award_button" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
                    <div class="modal-dialog modal-sm" role="document">
                        <div class="modal-content">
                            <div class="award_cash_title">
                                 提示消息
                            </div>
                            <div class="award_cash_bg">
                                 目前暂无可兑换商品
                            </div>
                        </div>
                    </div>
                </div>






            </div>
            <div role="tabpanel" class="tab-pane fade" id="profile" aria-labelledby="profile-tab">
                <div class="col-md-12 Integral_first">
                    <a href="" class="Integral_green" target="_blank">积分构成和来源说明</a>
                    <span>当前积分:<em class="blueNum">0</em></span>
                </div>
                <span>选择时间:</span>
                <span class="dropdown">
                    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                        今年内记录
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                        <li><a href="#">2016年记录</a></li>
                    </ul>
                </span>
                <button class="btn btn-info">查看</button>
                <table class="table table-striped" >
                     <tr>
                         <th>时间</th>
                         <th>获取记录</th>
                         <th>积分</th>
                     </tr>
                     <tr>
                         <td>暂无任何数据</td>
                     </tr>
                </table>

            </div>
            <div role="tabpanel" class="tab-pane fade" id="dropdown1" aria-labelledby="dropdown1-tab">
                <div class="col-md-12 Integral_first">
                    <a href="" class="Integral_green" target="_blank">积分构成和来源说明</a>
                    <span>当前积分:<em class="blueNum">0</em></span>
                </div>
                <span>选择时间:</span>
                <span class="dropdown">
                    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                        今年内记录
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                        <li><a href="#">2016年记录</a></li>
                    </ul>
                </span>
                <button class="btn btn-info">查看</button>
                <table class="table table-striped" >
                    <tr>
                        <th>时间</th>
                        <th>消耗记录</th>
                        <th>积分</th>
                    </tr>
                    <tr>
                        <td>暂无任何数据</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

@endsection